<extend name="Public/base"/>

<block name="body">

    <!-- 按钮工具栏 -->
    <div class="cf">
        <div class="fl">
            <a class="btn" href="{:U()}">刷 新</a>（点击"刷新"按钮清除搜索条件，显示全部信息。）
        </div>

        <!-- 高级搜索 -->
        <form action="{:U()}" method="GET" id="J_search_form">
            <div class="search-form fr cf">
                <div class="sleft">
                    <input type="text" name="start_time" class="search-input w-100 date_select" value="{$start_time}" placeholder="起始时间"/>
                    <span class="fl line-h">至</span>
                    <input type="text" name="end_time" class="search-input w-100 date_select" value="{$end_time}" placeholder="今天"/>
                    <a class="sch-btn" href="javascript:;" id="J_search"><i class="btn-search"></i></a>
                </div>
            </div>
        </form>
    </div>
    <!-- 数据表格 -->
    <div class="data-table table-striped">
        <table>
            <thead>
            <tr>
                <th>种类</th>
                <th>昨日</th>
                <th>今日</th>
                <th>上周</th>
                <th>本周</th>
                <th>消费总数</th>
            </tr>
            </thead>
            <volist name="stat.dataNum" id="vo">
                <tbody>
                <tr>
                    <td>{$vo.sName}</td>
                    <td>{$vo.yesterday_count|default='-'}</td>
                    <td>{$vo.today_count|default='-'}</td>
                    <td>{$vo.pweek_count|default='-'}</td>
                    <td>{$vo.week_count|default='-'}</td>
                    <td>{$vo.count|default='-'}</td>
                </tr>
                </tbody>
            </volist>
        </table>
    </div>
    <div class="chart-body" style="overflow: hidden">
        <div class="box_1" id="chart_box"></div>
        <div class="cache-by">
            数据缓存于：
            {$stat.cacheTime|format_date}
            <empty name="stat.is_new">
                &nbsp; <a href="javascript:clearCache();">更新</a>
            </empty>
        </div>
        <div class="box_1" id="chart_box1"></div>

    </div>
    <style>
        .box_1{
            width: 40%;
            float: left;
            margin-right:20px;
        }
    </style>
</block>

<block name="script">
<script language="javascript" type="text/javascript" src="__JS__/echarts/echarts-all.js"></script>
<script language="javascript" type="text/javascript" src="__JS__/My97Date/WdatePicker.js"></script>
<script type="text/javascript">
    function clearCache(){
        url = window.location.href;
        $.get(url, {'reload':1}, function(){
            window.location.reload();
        });
    }

    $(function() {
        //搜索
        $("#search").click(function() {
            var url = $(this).attr('url');
            var query = $('.search-form').find("select,input").serialize();
            query = query.replace(/(&|^)(\w*?\d*?\-*?_*?)*?=?((?=&)|(?=$))/g, '');
            query = query.replace(/^&/g, '');
            url += query ? ((url.indexOf('?') > - 1 ? '&' : '?') + query) : '';
            window.location.href = url;
        });

        //回车自动提交
        $('.search-form').find('input').keyup(function(event) {
            if(event.keyCode === 13) {
                $("#search").click();
            }
        });
        //导航高亮
        highlight_subnav("{:U('promote')}");
        $('.date_select').focus(function() {
            WdatePicker({skin: 'twoer', dateFmt: 'yyyy-MM-dd', maxDate: '%y-%M-%d'});
        });
        //结束日期智能化判断
        if($('input[name="end_time"]').val() === "{$today}"){
            $('input[name="end_time"]').val("");
        }
    });
</script>
<script type="text/javascript">
$('#search-form').css({marginTop:'400px'});
$('#chart_box').css({height:'400px',width:'700px', marginTop:'50px'});
var myChart = echarts.init(document.getElementById('chart_box'));
//优惠券
option = {
    title : {
        text : '优惠券金额'
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data: {$stat.coupon.legend}
},
        toolbox: {
    show: true,
            feature: {
        mark: {show: true},
        dataView: {show: false, readOnly: false},
        magicType: {show: true, type: ['line', 'bar', 'tiled']},
        restore: {show: true},
        saveAsImage: {show: true},
        type : ['tiled'],
    },
    x : '130',
},
calculable: true,
        xAxis: [
    {
        type: 'category',
        boundaryGap: false,
        data: {$stat.coupon.xAxis}
}
],
yAxis: [
    {
        type: 'value'
    }
],
        series: {$stat.coupon.data},
};


myChart.setOption(option);
//满减
$('#chart_box1').css({height:'400px',width:'700px', marginTop:'50px'});
var myChart1 = echarts.init(document.getElementById('chart_box1'));
//待支付
option = {
    title : {
        text : '满减金额'
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data: {$stat.manjian.legend}
},
        toolbox: {
    show: true,
            feature: {
        mark: {show: true},
        dataView: {show: false, readOnly: false},
        magicType: {show: true, type: ['line', 'bar', 'tiled']},
        restore: {show: true},
        saveAsImage: {show: true},
        type : ['tiled'],
    },
    x : '130',
},
calculable: true,
        xAxis: [
    {
        type: 'category',
        boundaryGap: false,
        data: {$stat.manjian.xAxis}
}
],
yAxis: [
    {
        type: 'value'
    }
],
        series: {$stat.manjian.data},
};


myChart1.setOption(option);








</script>
<script type="text/javascript">

</script>
</block>